﻿@{
    ViewData["Title"] = "HousingPricecalCalendarView";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@* 价格日历 *@
<script src="~/fullcalendar-6.1.15/packages/core/index.global.js"></script>
<script src="~/fullcalendar-6.1.15/dist/index.global.js"></script>
<script src="~/fullcalendar-6.1.15/packages/core/locales/zh-cn.global.js"></script>
<script src="~/fullcalendar-6.1.15/packages/daygrid/index.global.js"></script>
<div id="calendar">
</div>
<div id="popupContent" style="display: none;">
    <div class="layui-form">
        <div class="layui-form-item">
            <label class="layui-form-label">价格：</label>
            <div class="layui-input-block">
                <input type="text" name="newPrice" value="0" required lay-verify="required|number" autocomplete="off" placeholder="Enter new price" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">可入住房间量：</label>
            <div class="layui-input-block">
                <input type="text" name="newCount" value="0" required lay-verify="required|integer" autocomplete="off" placeholder="Enter new count" class="layui-input">
            </div>
        </div>
    </div>
</div>

@* <script src="~/rooms/roomhousingpricecalendar.js"></script> *@
<script>
    layui.use(['jquery', 'layer'], function () {
        var layer = layui.layer;
        var $ = layui.jquery;
        $(document).ready(function () {
            var calendarEl = document.getElementById('calendar');

            var calendar = new FullCalendar.Calendar(calendarEl, {
                initialView: 'dayGridMonth',
                locale: 'zh-cn',
                events: function (fetchInfo, successCallback, failureCallback) {
                    var form = {
                        roomId: sessionStorage.getItem("roomId"),
                        productsName: sessionStorage.getItem("productsName"),
                        addTime: ""
                    }

                    //获取显示值
                    $.post({
                        url: 'http://localhost:5174/api/RoomHousingState/GetAllPriceCalendar',
                        contentType: "application/json",
                        data: JSON.stringify(form),
                        headers: {
                            "Authorization": "Bearer " + localStorage.getItem('token')
                        },
                        async: true,
                        success: function (res) {
                            var datesWithPriceAndCount = [];
                            // 遍历获取的数据，生成符合要求的事件对象
                            res.data.forEach(function (eventData) {
                                var event = {
                                    id: eventData.priceCalendarId,
                                    title: eventData.productsName,
                                    start: eventData.addTime,
                                    price: eventData.priceEveryDate,
                                    count: eventData.canCheckIn
                                };
                                datesWithPriceAndCount.push(event);
                            });

                            successCallback(datesWithPriceAndCount); // 将处理后的事件对象传递给 successCallback
                        },
                        error: function (error) {
                            console.error(error);
                        }
                    })
                },
                eventClick: function (info) {

                    var popupContent = document.getElementById('popupContent').innerHTML;

                    layer.open({
                        title: '修改价格',
                        area: ['700px', '400px'], // 宽高
                        content: popupContent,
                        btn: ['确认', '取消'],
                        success: function (layero, index) {
                            // 弹窗成功打开后，设置输入框的值
                            layero.find('[name="newPrice"]').val(info.event.extendedProps.price);
                            layero.find('[name="newCount"]').val(info.event.extendedProps.count);
                        },
                        yes: function (index, layero) {

                            var form = {
                                priceCalendarId: info.event.id,
                                canCheckIn: parseInt(layero.find('input[name="newCount"]').val()),
                                priceEveryDate: parseFloat(layero.find('input[name="newPrice"]').val())
                            }

                            $.ajax({
                                url: 'http://localhost:5174/api/RoomHousingState/UpdatePrice',
                                type: 'post',
                                contentType: "application/json",
                                data: JSON.stringify(form),
                                success: function (res) {
                                    // 添加成功后的操作
                                    if (res.code > 0) {
                                        layer.msg("修改成功");
                                        // 关闭弹窗
                                        layer.closeAll(); // 关闭所有弹出层
                                        // 刷新日历
                                        calendar.refetchEvents();
                                    }
                                },
                                error: function (error) {
                                    console.error(error)
                                }
                            });
                        }
                    });
                },
                eventContent: function (arg) {
                    // Custom event content displaying price and count
                    var html = '<div class="fc-content">价格: ￥' + arg.event.extendedProps.price + '<br>可入住: ' + arg.event.extendedProps.count + '</div>';
                    return { html: html };
                }
            });

            calendar.render();
        });
    });
</script>